<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>修改商品</title>
    <th:block th:insert="~{/fixed/header::head}"></th:block>
    <link rel="stylesheet" th:href="@{/css/index.css}">
</head>

<script>
    $(function (){
        //点击发货按钮响应事件
        $("#deliver").click(function (){
            let oid = $("#oid").text();
            $.ajax({
                url:"/admin/orders/updataByState",
                method:"POST",
                data:{"oid":oid},
                success:function (data){
                    if (data){
                        location.href = "/admin/orders"
                    }else {
                        $("#modalText").text("发货失败，库存不足，请及时增加库存");
                        $("#myModal").modal('show');
                    }
                }
            })
        })
    })
</script>

<body>
<!--头部导航条-->
<th:block th:insert="~{/fixed/headerBar::headBar}"></th:block>

<div class="container-fluid">
    <div class="row">
        <!--侧边栏-->
        <th:block th:insert="~{/fixed/siedBar::siedBar}"></th:block>

        <main role="main" class="col-md-9 ml-sm-auto col-lg-10 px-4">
            <form>
                <div>
                    <label style="font-size: 20px;">订单编号：</label>
                    <label id="oid" style="font-size: 20px;" th:text="${ordersData.oid}"></label>
                </div>
                <div>
                    <label style="font-size: 20px;">订单创建日期：</label>
                    <label style="font-size: 20px;" th:text="${ordersData.ordersDate}"></label>
                </div>
                <div>
                    <label style="font-size: 20px;">用户姓名：</label>
                    <label style="font-size: 20px;" th:text="${ordersData.userName}"></label>
                </div>
                <div class="card" style="width: 18rem;">
                    <img class="card-img-top" th:src="${ordersData.goodsImg}" alt="商品图片">
                </div>
                <div class="form-group">
                    <label style="font-size: 20px;">商品名称：</label>
                    <label style="font-size: 20px;" th:text="${ordersData.goodsName}"></label>
                </div>
                <div class="form-group">
                    <label style="font-size: 20px;">购买数量：</label>
                    <label style="font-size: 20px;" th:text="${ordersData.ordersQuantity}"></label>
                </div>
                <div class="form-group">
                    <label style="font-size: 20px;">订单价格：</label>
                    <label style="font-size: 20px;" th:text="${ordersData.ordersPrice}"></label>
                </div>
                <div class="form-group">
                    <label style="font-size: 20px;">收货人姓名：</label>
                    <label style="font-size: 20px;" th:text="${ordersData.consignee}"></label>
                </div>
                <div class="form-group">
                    <label style="font-size: 20px;">收货地址：</label>
                    <label style="font-size: 20px;" th:text="${ordersData.address}"></label>
                </div>
                <div class="form-group">
                    <span style="font-size: 20px;">订单状态：</span>
                    <span class="alert alert-danger"  th:if="${ordersData.ordersState} == 0">未支付</span>
                    <span class="alert alert-warning" th:if="${ordersData.ordersState} == 1">待发货</span>
                    <span class="alert alert-primary" th:if="${ordersData.ordersState} == 2">已发货</span>
                    <span class="alert alert-success" th:if="${ordersData.ordersState} == 3">已收货</span>
                </div>

                <button th:if="${ordersData.ordersState} == 1" id="deliver" type="button" class="btn btn-primary">发货</button>
            </form>
        </main>
    </div>
</div>
<!--引入模态框-->
<th:block th:insert="~{/fixed/modal::modal}"></th:block>
</body>
</html>